/** 动画 **/
.#{$dgg}-anim{-webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}
.#{$dgg}-anim.#{$dgg}-icon{display: inline-block;}
.#{$dgg}-anim-loop{-webkit-animation-iteration-count: infinite; animation-iteration-count: infinite;}
.#{$dgg}-trans,
.#{$dgg}-trans a{transition: all .3s; -webkit-transition: all .3s;} /* 过度变换 */

@-webkit-keyframes #{$dgg}-rotate{ /* 循环旋转 */
  from {-webkit-transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);}
}
@keyframes #{$dgg}-rotate{
  from {transform: rotate(0deg);}
  to {transform: rotate(360deg);}
}
.#{$dgg}-anim-rotate{-webkit-animation-name: #{$dgg}-rotate; animation-name: #{$dgg}-rotate; -webkit-animation-duration: 1s; animation-duration: 1s;  -webkit-animation-timing-function: linear; animation-timing-function: linear;}

@-webkit-keyframes #{$dgg}-up{ /* 从最底部往上滑入 */
  from {-webkit-transform: translate3d(0, 100%, 0); opacity: 0.3;}
  to {-webkit-transform: translate3d(0, 0, 0);  opacity: 1;}
}
@keyframes #{$dgg}-up{
  from {transform: translate3d(0, 100%, 0);  opacity: 0.3;}
  to {transform: translate3d(0, 0, 0);  opacity: 1;}
}
.#{$dgg}-anim-up{-webkit-animation-name: #{$dgg}-up; animation-name: #{$dgg}-up;}

@-webkit-keyframes #{$dgg}-upbit{ /* 微微往上滑入 */
  from {-webkit-transform: translate3d(0, 30px, 0); opacity: 0.3;}
  to {-webkit-transform: translate3d(0, 0, 0);  opacity: 1;}
}
@keyframes #{$dgg}-upbit{
  from {transform: translate3d(0, 30px, 0);  opacity: 0.3;}
  to {transform: translate3d(0, 0, 0);  opacity: 1;}
}
.#{$dgg}-anim-upbit{-webkit-animation-name: #{$dgg}-upbit; animation-name: #{$dgg}-upbit;}


@-webkit-keyframes #{$dgg}-scale { /* 放大 */
  0% {opacity: 0.3; -webkit-transform: scale(.5);}
  100% {opacity: 1; -webkit-transform: scale(1);}
}
@keyframes #{$dgg}-scale {
  0% {opacity: 0.3; -ms-transform: scale(.5); transform: scale(.5);}
  100% {opacity: 1; -ms-transform: scale(1); transform: scale(1);}
}
.#{$dgg}-anim-scale{-webkit-animation-name: #{$dgg}-scale; animation-name: #{$dgg}-scale}

@-webkit-keyframes #{$dgg}-scale-spring { /* 弹簧式放大 */
  0% {opacity: 0.5; -webkit-transform: scale(.5);}
  80% {opacity: 0.8; -webkit-transform: scale(1.1);}
  100% {opacity: 1; -webkit-transform: scale(1);}
}
@keyframes #{$dgg}-scale-spring {
  0% {opacity: 0.5; transform: scale(.5);}
  80% {opacity: 0.8; transform: scale(1.1);}
  100% {opacity: 1; transform: scale(1);}
}
.#{$dgg}-anim-scaleSpring{-webkit-animation-name: #{$dgg}-scale-spring; animation-name: #{$dgg}-scale-spring}

@-webkit-keyframes #{$dgg}-fadein { /* 渐现 */
  0% {opacity: 0;}
  100% {opacity: 1;}
}
@keyframes #{$dgg}-fadein {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
.#{$dgg}-anim-fadein{-webkit-animation-name: #{$dgg}-fadein; animation-name: #{$dgg}-fadein}

@-webkit-keyframes #{$dgg}-fadeout { /* 渐隐 */
  0% {opacity: 1;}
  100% {opacity: 0;}
}
@keyframes #{$dgg}-fadeout {
  0% {opacity: 1;}
  100% {opacity: 0;}
}
.#{$dgg}-anim-fadeout{-webkit-animation-name: #{$dgg}-fadeout; animation-name: #{$dgg}-fadeout}